<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
    <meta name="keywords" content="LED,显示屏,高清小间距LED显示屏,高清,小间距,户外全彩LED显示屏,室内全彩LED显示屏,LED照明,LED显示解决方案,大屏幕,LED显示屏生产厂家,LED显示屏报价，江西LED显示屏报价">
    <meta name="description" content="江西鑫磊光电科技有限公司是一家专业从事LED产品应用研发、设计、生产、销售和服务于一体的产品服务商。">
    <link rel="stylesheet" href="./zhanshi.css">
    <link rel="shortcut icon" href="./images/ifavion.ico">
    <script src="./js/jquery-3.6.0.min.js"></script>
</head>

<body>
    <div class="zhanshi">
        <!-- 顶部,导航栏开始 -->
        <?php include "./header.php" ?>
        <!-- 顶部,导航栏结束 -->
        <!-- 主体部分开始 -->
        <div class="main">
            <div>
                <!--aboutus banner开始 -->
                <div class="aboutus_banner">
                    <div>
                        <h4>ABOUT US </h4><br><span>关于我们</span>
                    </div>

                </div>
                <!-- banner结束 -->
                <!-- aboutus  主体部分开始 -->
                <div class="aboutus_main clearfix">
                    <div class="aboutus_left">
                        <div class="left_top clearfix">
                            <p>A</p>
                            <h3><span>boutus</span><br>关于我们</h3>
                        </div>
                        <ul></ul>
                    </div>
                    <div class="aboutus_right">
                        <div class="right_top clearfix">
                            <h3></h3>
                            <p>您的位置：首页 > <span></span></p>
                        </div>
                        <div class="aboutus_content"></div>
                    </div>
                </div>
                <!-- aboutus  主体部分结束 -->
            </div>
        </div>

        <!-- 主体部分结束 -->
        <!-- 底部开始 -->
        <?php include "./bottom.php" ?>
        <!-- 底部结束 -->
    </div>

    <script>
        // 得到地址栏的地址
        function getQueryVariable(variable)
        {
            var query = window.location.search.substring(1);
            var vars = query.split("&");
            for (var i=0;i<vars.length;i++) {
                    var pair = vars[i].split("=");
                    if(pair[0] == variable){return pair[1];}
            }
            return(false);
        }
        var sortid=getQueryVariable("sortid");
        $(function () {
            sortid=sortid==false?'3':sortid;
            getList();


            // 选中左边列表中的项 显示其内容 并加上选中的样式
            $(document).on("click","#list",function () {
                getList();
            })

            function getList() {
                $.ajax({
                    url: "./aboutus_list.php",
                    dataType: "json",
                    data:{sortid:sortid},
                    success: function (res) {
                        var html='';
                        if (res.code==0) {
                            // 展示左边的列表
                            res.list.forEach( (item,index) => { 
                                // var css=index==0?"active":'';
                                var css1=sortid==item.id?"class='active'":'';
                                html+=`<li><a href="?sortid=${item.id}" id="list" ${css1}>${item.sortname}</a></li>`;
                                // html+=`<li><a href="?sortid=${item.id}" id="list" class="${css}" ${css1}>${item.sortname}</a></li>`;
                            });
                            $(".aboutus_left>ul").html(html);
                            // 进入页面默认选中第一个
                            // $(".aboutus_left>ul>li").eq(0).children().addClass("active");
                            // 内容页面
                            var contentHtml=''
                            res.data.forEach(el => {
                                contentHtml+=`${el.content}`;
                            });
                            $("title").text(res.sortname+"-江西鑫磊光电科技有限公司");
                            $(".aboutus_content").html(contentHtml);
                            $(".right_top>h3,.right_top>p>span").html(res.sortname);

                        }
                        
                    }
                });
            }
            
            

            // // 选中左边列表中的项 显示其内容 并加上选中的样式
            // $(document).on("click","#list",function () {
            //     var id=$(this).data("id");
            //     $(this).addClass("active").parent().siblings().children().removeClass("active");
            //     $.ajax({
            //         type: "post",
            //         url: "./aboutus_list.php",
            //         data: {id:id},
            //         dataType: "json",
            //         success: function (res) {
            //             if (res.code==0) {
            //                 $(".aboutus_content").html(res.content);
            //                 $(".right_top>h3,.right_top>p>span").html(res.sortname);
            //             }
            //         }
            //     });
            // })

        })

    </script>
</body>

</html>